Google Tag Managerで広告用のHTMLタグを配信する

はじめに

WEBサイトを運営していく中で、広告用のバナーを追加したいといったことがあるかと思います。 そういった際に、TAG Managerから要素を追加する事ができないかを検証してみました。

検証内容

前回作成したサイトの商品名の上部に、特売セール実施中と記載したタグを挿入する。

実装例

実装方法としては、カスタムHTMLタグとして実装を進めます。

しかし、ただ単純にカスタムHTMLとしてHTMLタグを作成しただけでは、 ページの下部に配置されるだけになってしまいます。 そのため、作成したDOM要素を配置しなおすJavaScriptを書く必要が有ります。

今回の場合は以下の用に記載しました。

タグ

HTML

<div id="header" class="row">
<div class="col-md-2"></div>
<h1 class="col-md-6">特売セール実施中</h1>
</div>
<script>
document.body.insertBefore(document.getElementById('header'),document.getElementsByClassName('row')[0]);
</script>

配信例

まとめ

ルールをより細かく記載する事で、特定の条件に該当する場合のみバーナーを表示する と言った事も可能になるかと思われます。 懸念点としては、DOM要素の入れ替えはJavaScriptで行う必要が有るため、 実際に実装したコードの各種ブウラウザでの対応状況の確認等も必要かと思われます。